<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script>			
		//解构赋值 定义时，需要解构相同
		//解构数组
			let arr = [1, 2, 3 ]
			//arr数组中的元素分别赋值给a，b，c
			//传统逐个赋值（索引访问赋值）
			// let a = arr[0]
			// let b = arr[1]
			// let c = arr[2]
			//数组解构赋值
			let [ a, b, c] = arr
			console.log(a,b,c)
			
			// , 可以用做占位
			//eg：把 arr 中的后两个值赋值给变量 d ,e
			let [, d, e] = arr
			console.log(d,e)
			
			//把 arr 中的第1个值赋值给变量 f, 剩余的全部给到变量 rest
			let [f, ...rest] = arr
			console.log(f,rest)
			
			//将数组arr01中的2 ，3分别赋值给a0，a1
			let arr01=[1, [2, 3], 4]
			let [, [a1,a2]] = arr01 //等同于 let [, [a1,a2],] = arr01
			console.log(a1,a2)
			
		//解构对象
			let obj01 = {
				name:"zhangshan",
				age:16,
				address:"广东省深圳市XX区"
			}
			
				//eg1：将对象中的值分别赋值给name，age，address
				// let { name, age, address } = obj01;//简写  等同于let { name:name, age:age, address:address } 
				// 								  //变量和属性名相同的可不按顺序写 let { age, name, address } = obj01;
				// console.log(name, age, address)
				
				//eg2：将 obj对象 中的 name属性，age属性，分别赋值给变量name、age
				// let { name, age } = obj01;
				// console.log(name, age)
				
				//eg3：把 obj 中的 name属性值给变量 name, 剩余的全部给到变量 restObj
				// let { name, ...restObj } = obj01;
				// console.log(name, restObj)
				
				// eg4：分别将对象中的属性值分别赋值给 unname，age，address		
				let { name:unname, age, address } = obj01;//注意将冒号前面的值 赋值给 冒号后面的值
				console.log(unname, age, address)
			
			let obj02 = {
				data:{
					code: 666,
					message: '信息列表获取成功',
					result: ['html', 'css', 'js', 'vue', 'springboot']
				},
				option: 1,
				status: 'ready'
			}//对象嵌套对象
			
			//obj02  eg：将 obj对象 中的 code，message，result 分别赋值给变量code，message，result
				//method 1：
				//	先解构取得data
				let { data } = obj02 
				//再解构data
				let{ code, message, result } = data
				console.log( code, message, result )
				
				 
				//method2：通过引用拿到data，再解构 data
				// let{ code, message, result } = obj02.data
				// console.log( code, message, result )
					
			
		</script>
	</body>
</html>